﻿<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <title th:text="${article.title} + ' - ' + ${SITE_CONFIG.SITE_NAME}"></title>
    <meta name="keywords" content="关键字" />
    <meta name="description" content="网站描述" />
    <meta name="renderer" content="webkit">
    <meta name="force-rendering" content="webkit">
    <!-- <link rel="icon" href="favicon.ico" mce_href="favicon.ico" type="image/x-icon"> -->
    <!-- <link rel="shortcut icon" href="favicon.ico" mce_href="favicon.ico" type="image/x-icon"> -->
    <link rel="stylesheet" th:href="@{/liuan/css/style.css}">
    <!--页面样式-->
    <link rel="stylesheet" th:href="@{/liuan/css/Swiper.css}">
    <!--页面样式-->
    <link rel="stylesheet" th:href="@{/liuan/css/animate.min.css}">
    <!--CSS3动画库-->
    <link rel="stylesheet" th:href="@{/liuan/css/font-awesome.min.css}">
</head>

<body>
    <div class="top">
        <div class="wid">
            <div class="top-fr fr">
                <div class="select fl">
                    <div class="search fl">
                        <input type="text" placeholder="请输入关键字">
                        <button></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="nav">
        <div class="wid">
            <div class="nav-col">
                <ul>
                    <li>
                        <a th:href="@{/}">
                            首页
                        </a>
                    </li>

                    <li th:each="category:${CATEGORY_LIST}">
                        <a th:if="${category.sort<100}" th:href="${'/blog/category/' + category.id}">
                            [[${category.name}]]
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="wid">
            <h3 th:text="${article.title}" style="text-align: center; font-size: large;"></h3>
            <br>
            <div th:utext="${article.content}">
            </div>
        </div>
    </div>
    <div class="footer" style="margin-top: 20px;">
        <div class="wid">
            <div class="footer-col">
                <p>
                    <a href="#">网站声明</a>
                    <a href="#">关于我们</a>
                    <a href="#">联系我们</a>
                    <a href="#">后台管理</a>
                    <a href="#">回忆旧版</a>
                </p>
                <p>
                    版权所有：刘安市公安局新都区分局 地址：刘安市局新都区分局
                </p>
                <p>
                    责任人：XXX 维护:XXX 地址：刘安市公安局新都区分局金龙路10号 电话：52720110
                </p>
            </div>
        </div>
    </div>
    <script th:src="@{/liuan/js/jquery.js}"></script>
    <!--jQuery库-->
    <script th:src="@{/liuan/js/wow.min.js}"></script>
    <!--动画效果库-->
    <script th:src="@{/liuan/js/jquery.kxbdmarquee.js}"></script>
    <!--动画效果库-->
    <script th:src="@{/liuan/js/swiper.min.js}"></script><!-- swiper -->
    <script th:src="@{/liuan/js/Epp-2.1.1.min.js}"></script>
    <!--Epp插件库-->
    <!-- <script src="js/ckplayer/ckplayer.js"></script> -->
    <!-- 无缝循环动画库 -->
    <script th:src="@{/liuan/js/jquery.SuperSlide.2.1.3.js}"></script>
    <script type="text/javascript">
    $(".picMarquee-left").slide({ mainCell: ".bd ul", autoPlay: true, effect: "leftMarquee", vis: 5, interTime: 25, trigger: "click" });
    </script>
    <script>
    $("#move1").adFloat({ width: 250, height: 125, top: 60, right: 100 })
    $("#marquee2").kxbdMarquee({ isEqual: false });
    


    $('.news-col .news-list .tit .tabs ul li').hover(function() {
        $(this).addClass('acti').siblings().removeClass('acti');
        var m = $(this).index();
        $('.news-col .news-list .content .list').eq(m).addClass('show').siblings().removeClass('show');
    })


   	$('.news-common .news-list .tit .tabs ul li').hover(function() {
        $(this).addClass('acti').siblings().removeClass('acti');
        var m = $(this).index();
        $('.news-common .news-list .content .list').eq(m).addClass('show').siblings().removeClass('show');
    })


    $('.news-common2 .news-list .tit .tabs ul li').hover(function() {
        $(this).addClass('acti').siblings().removeClass('acti');
        var m = $(this).index();
        $('.news-common2 .news-list .content .list').eq(m).addClass('show').siblings().removeClass('show');
    })

    $('.letter-form .cont .item a').click(function() {
        var i = $(this).index();
        $('.letter-tabel').eq(i).addClass('show').siblings().removeClass('show');
    })
    $('.tabs .txt ul li').click(function() {
        $(this).addClass('acti').siblings().removeClass('acti');
        var o = $(this).index();
        $('.tabs-list').eq(o).addClass('show').siblings().removeClass('show');
    })

    $('.sidebar-nav .tabs ul li').hover(function() {
        // alert(1)
        $(this).addClass('acti').siblings().removeClass('acti');
        var t = $(this).index();
        $('.journalism-sidebar .nav-tabs').eq(t).addClass('show').siblings().removeClass('show');
    })
    $('.introduce-news .tabs ul li').hover(function() {
        $(this).addClass('acti').siblings().removeClass('acti');
        var t = $(this).index();
        $('.introduce-news .item').eq(t).addClass('show').siblings().removeClass('show');
    })
    $('.fix-bann span.close').click(function() {
        $(this).parent('div').fadeOut();
    })
    fade(".news-bann ul li", ".news-bann .pagination span", "3000", "", "");
    roll_picture(".function ul li", "6")
    var u = 0;
    $('.journalism .next').click(function() {
        u++;
        if (u > 3) {
            u = 0;
            $(' .sidebar-link .sidebar-swiper').animate({ "top": -u * 62 + "px" }, 300)
        } else {
            $(' .sidebar-link .sidebar-swiper').animate({ "top": -u * 62 + "px" }, 300)
        }
    })
    $('.journalism .prev').click(function() {
        u--;
        if (u < 1) {
            u = 3;
            $(' .sidebar-link .sidebar-swiper').animate({ "top": u * -62 + "px" }, 300)
        } else {
            $(' .sidebar-link .sidebar-swiper').animate({ "top": u * -62 + "px" }, 300)
        }
    })
    $('.top .top-fr .buttons button').click(function() {
        $('.top-fr').addClass('acti').siblings().removeClass('acti');
    })
    </script>
</body>

</html>